{% macro render_comment(comment, current_user=None, level=0) %}
<div class="comment card" style="margin-left: {{ level * 40 }}px;" id="c-{{ comment.id }}">
    <div class="comment-header">
        <span class="comment-author">{{ comment.author.username }}</span>
        <span class="comment-time">{{ comment.timestamp.strftime('%Y-%m-%d %H:%M') }}</span>
    </div>
    <div class="comment-content">
        {{ comment.content }}
    </div>
    <div class="comment-actions">
        <button class="btn btn-sm like-comment {% if current_user and current_user.is_authenticated and comment.is_liked_by(current_user) %}liked{% endif %}" 
                data-comment-id="{{ comment.id }}">
            <i class="fas fa-thumbs-up"></i>
            <span class="like-count">{{ comment.likes_count }}</span>
        </button>
        {% if current_user and current_user.is_authenticated and level < 3 %}
        <button class="btn btn-sm reply-btn" data-comment-id="{{ comment.id }}">
            <i class="fas fa-reply"></i> 回复
        </button>
        {% endif %}
    </div>
    
    {% if current_user and current_user.is_authenticated and level < 3 %}
    <div class="reply-form" id="reply-form-{{ comment.id }}" style="display: none;">
        <textarea class="form-control reply-input" placeholder="写下你的回复..."></textarea>
        <div class="reply-actions">
            <button class="btn btn-sm submit-reply" data-comment-id="{{ comment.id }}">发送回复</button>
            <button class="btn btn-sm cancel-reply">取消</button>
        </div>
    </div>
    {% endif %}
    
    {% if comment.replies %}
    <div class="replies" id="replies-{{ comment.id }}">
        {% set visible_replies = comment.replies[:3] %}
        {% for reply in visible_replies %}
            {{ render_comment(reply, current_user=current_user, level=level+1) }}
        {% endfor %}
        
        {% if comment.replies|length > 3 %}
        <div class="more-replies" id="more-replies-{{ comment.id }}">
            <button class="btn btn-sm show-more-replies" data-comment-id="{{ comment.id }}" 
                    data-total-replies="{{ comment.replies|length }}">
                展开更多回复 ({{ comment.replies|length - 3 }})
            </button>
            <div class="hidden-replies" style="display: none;">
                {% for reply in comment.replies[3:] %}
                    {{ render_comment(reply, current_user=current_user, level=level+1) }}
                {% endfor %}
            </div>
        </div>
        {% endif %}
    </div>
    {% endif %}
</div>
{% endmacro %} 